// 转场效果配置文件
export interface TransitionConfig {
  name: string
  mode: 'out-in' | 'in-out'
  duration: number
  containerClass?: string
  easing?: string
  delay?: number
}

export interface RouteTransition {
  from: string | RegExp
  to: string | RegExp
  transition: TransitionConfig
  priority?: number
}

// Apple风格的缓动函数
export const EASING = {
  // 标准缓动 - 类似iOS的默认动画
  STANDARD: 'cubic-bezier(0.25, 0.46, 0.45, 0.94)',
  // 弹性缓动 - 类似iOS的弹性动画
  SPRING: 'cubic-bezier(0.68, -0.55, 0.265, 1.55)',
  // 快速缓动 - 类似iOS的快速动画
  FAST: 'cubic-bezier(0.25, 0.46, 0.45, 0.94)',
  // 慢速缓动 - 类似iOS的慢速动画
  SLOW: 'cubic-bezier(0.25, 0.46, 0.45, 0.94)'
}

// 转场效果定义
export const TRANSITIONS = {
  // 水平滑动
  SLIDE_LEFT: {
    name: 'slide-left',
    mode: 'out-in' as const,
    duration: 200,
    containerClass: 'slide-left-transition',
    easing: EASING.STANDARD
  },
  
  SLIDE_RIGHT: {
    name: 'slide-right',
    mode: 'out-in' as const,
    duration: 200,
    containerClass: 'slide-right-transition',
    easing: EASING.STANDARD
  },
  
  // 垂直滑动
  SLIDE_UP: {
    name: 'slide-up',
    mode: 'out-in' as const,
    duration: 150,
    containerClass: 'slide-up-transition',
    easing: EASING.STANDARD
  },
  
  SLIDE_DOWN: {
    name: 'slide-down',
    mode: 'out-in' as const,
    duration: 150,
    containerClass: 'slide-down-transition',
    easing: EASING.STANDARD
  },
  
  // 缩放效果
  SCALE_UP: {
    name: 'scale-up',
    mode: 'in-out' as const,
    duration: 175,
    containerClass: 'scale-up-transition',
    easing: EASING.SPRING
  },
  
  SCALE_DOWN: {
    name: 'scale-down',
    mode: 'in-out' as const,
    duration: 175,
    containerClass: 'scale-down-transition',
    easing: EASING.SPRING
  },
  
  // 淡入淡出
  FADE: {
    name: 'fade',
    mode: 'out-in' as const,
    duration: 125,
    containerClass: 'fade-transition',
    easing: EASING.FAST
  },
  
  // 翻转效果
  FLIP: {
    name: 'flip',
    mode: 'out-in' as const,
    duration: 250,
    containerClass: 'flip-transition',
    easing: EASING.SPRING
  },
  
  // 3D翻转
  FLIP_3D: {
    name: 'flip-3d',
    mode: 'out-in' as const,
    duration: 300,
    containerClass: 'flip-3d-transition',
    easing: EASING.SPRING
  }
}

// 路由转场规则配置
export const ROUTE_TRANSITIONS: RouteTransition[] = [
  // 首页相关转场
  {
    from: '^/$',
    to: '^/products$',
    transition: TRANSITIONS.SLIDE_LEFT,
    priority: 10
  },
  
  {
    from: '^/$',
    to: '^/categories$',
    transition: TRANSITIONS.SLIDE_LEFT,
    priority: 10
  },
  
  {
    from: '^/$',
    to: '^/brands$',
    transition: TRANSITIONS.SLIDE_LEFT,
    priority: 10
  },
  
  // 商品相关转场
  {
    from: '^/products$',
    to: '^/product/',
    transition: TRANSITIONS.SCALE_UP,
    priority: 15
  },
  
  {
    from: '^/categories$',
    to: '^/category/',
    transition: TRANSITIONS.SCALE_UP,
    priority: 15
  },
  
  {
    from: '^/brands$',
    to: '^/brand/',
    transition: TRANSITIONS.SCALE_UP,
    priority: 15
  },
  
  // 购物流程转场
  {
    from: '^/product/',
    to: '^/cart$',
    transition: TRANSITIONS.SLIDE_UP,
    priority: 20
  },
  
  {
    from: '^/cart$',
    to: '^/checkout$',
    transition: TRANSITIONS.SLIDE_UP,
    priority: 20
  },
  
  {
    from: '^/checkout$',
    to: '^/payment/',
    transition: TRANSITIONS.SLIDE_UP,
    priority: 20
  },
  
  // 用户中心转场
  {
    from: '^/user$',
    to: '^/user/',
    transition: TRANSITIONS.FADE,
    priority: 25
  },
  
  {
    from: '^/user/',
    to: '^/user/',
    transition: TRANSITIONS.FADE,
    priority: 25
  },
  
  // 管理后台转场
  {
    from: '^/admin$',
    to: '^/admin/',
    transition: TRANSITIONS.SLIDE_UP,
    priority: 30
  },
  
  {
    from: '^/admin/',
    to: '^/admin/',
    transition: TRANSITIONS.SLIDE_UP,
    priority: 30
  },
  
  // 认证页面转场
  {
    from: '^/auth$',
    to: '^/auth/',
    transition: TRANSITIONS.FADE,
    priority: 35
  },
  
  // 返回首页的转场
  {
    from: '^/(products|categories|brands)$',
    to: '^/$',
    transition: TRANSITIONS.SLIDE_RIGHT,
    priority: 5
  },
  
  {
    from: '^/product/',
    to: '^/(products|categories|brands)$',
    transition: TRANSITIONS.SCALE_DOWN,
    priority: 15
  },
  
  // 搜索页面转场
  {
    from: '^/search$',
    to: '^/product/',
    transition: TRANSITIONS.SCALE_UP,
    priority: 15
  },
  
  // 订单相关转场
  {
    from: '^/orders$',
    to: '^/order/',
    transition: TRANSITIONS.SCALE_UP,
    priority: 20
  },
  
  {
    from: '^/order/',
    to: '^/order/',
    transition: TRANSITIONS.FADE,
    priority: 20
  }
]

// 默认转场效果
export const DEFAULT_TRANSITION: TransitionConfig = {
  name: 'slide',
  mode: 'out-in',
  duration: 300,
  containerClass: 'default-transition',
  easing: EASING.STANDARD
}

// 转场效果匹配器
export class TransitionMatcher {
  private transitions: RouteTransition[]
  
  constructor(transitions: RouteTransition[] = ROUTE_TRANSITIONS) {
    this.transitions = transitions.sort((a, b) => (b.priority || 0) - (a.priority || 0))
  }
  
  // 匹配转场效果
  match(from: string, to: string): TransitionConfig {
    for (const routeTransition of this.transitions) {
      if (this.matchesPattern(from, routeTransition.from) && 
          this.matchesPattern(to, routeTransition.to)) {
        return routeTransition.transition
      }
    }
    
    return DEFAULT_TRANSITION
  }
  
  // 检查路径是否匹配模式
  private matchesPattern(path: string, pattern: string | RegExp): boolean {
    if (typeof pattern === 'string') {
      return path === pattern
    }
    return pattern.test(path)
  }
  
  // 获取所有转场效果
  getAllTransitions(): RouteTransition[] {
    return this.transitions
  }
  
  // 添加自定义转场规则
  addTransition(transition: RouteTransition): void {
    this.transitions.unshift(transition)
    this.transitions.sort((a, b) => (b.priority || 0) - (a.priority || 0))
  }
  
  // 移除转场规则
  removeTransition(from: string, to: string): void {
    this.transitions = this.transitions.filter(t => 
      !(this.matchesPattern(from, t.from) && this.matchesPattern(to, t.to))
    )
  }
}

// 创建默认的转场匹配器实例
export const defaultMatcher = new TransitionMatcher()
